<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE html>
<html lang="en">
<head>
    <base href="<%=basePath%>">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <title>修改个人信息</title>
    <%@include file="../../common.jsp"%>
    <script src="/js/md5.js"></script>
    <script>
        $(function () {
            //判断性别
            if("${sessionScope.login_user.sex}" == "男"){
                $(":input[value = '男']").attr("checked",true);
            }else{
                $(":input[value = '女']").attr("checked",true);
            }
        })
    </script>
</head>
<body>
    <h2>个人资料修改</h2>
    <hr>
    <form class="layui-form" action="" id="form">
        <input type="hidden" name="id" value="${sessionScope.login_user.id}">
        <div class="layui-form-item">
            <label class="layui-form-label">用户名:</label>
            <div class="layui-input-block">
                <input type="text" name="username" required  lay-verify="required" placeholder="" readonly autocomplete="off" class="layui-input" value="${sessionScope.login_user.username}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">用户名称:</label>
            <div class="layui-input-block">
                <input type="text" name="name" required  lay-verify="required" placeholder="" readonly autocomplete="off" class="layui-input" value="${sessionScope.login_user.name}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">旧密码:</label>
            <div class="layui-input-block">
                <input type="password" name="oldpassword" required lay-verify="required" placeholder="请输入旧密码" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">新密码:</label>
            <div class="layui-input-block">
                <input type="password" name="newpassword" required lay-verify="required" placeholder="请输入新密码" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">确认密码:</label>
            <div class="layui-input-block">
                <input type="password" name="password" required lay-verify="required" placeholder="请输入新密码" autocomplete="off" class="layui-input">
            </div>
        </div
        <dicdv class="layui-form-item">
            <label class="layui-form-label">性别:</label>
            <div class="layui-input-block">
                <input type="radio" name="sex" value="男" title="男">
                <input type="radio" name="sex" value="女" title="女">
            </div>
        </dicdv>
        <div class="layui-form-item">
            <label class="layui-form-label">入职日期:</label>
            <div class="layui-input-block">
                <input type="text" name="create" required  lay-verify="required" placeholder="" autocomplete="off" disabled class="layui-input" id="datetime" value="${sessionScope.login_user.entryDate}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">联系电话:</label>
            <div class="layui-input-block">
                <input type="text" name="phoneTel" required  lay-verify="required" placeholder="" autocomplete="off" class="layui-input" value="${sessionScope.login_user.phoneTel}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">电子邮箱:</label>
            <div class="layui-input-block">
                <input type="email" name="email" autocomplete="off" class="layui-input" value="${sessionScope.login_user.email}">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="button" class="layui-btn layui-btn-fluid" onclick="sub()">保存修改</button>
            </div>
        </div>
    </form>

    <script>
        layui.use(["table","form","laydate"],function () {
            //执行一个laydate实例
            layui.laydate.render({
                elem: '#datetime' //指定元素
            });
        });
        //验证新密码
        function newpassword() {
            var newpassword = $(":input[name = 'newpassword']").val();
            var password = $(":input[name = 'password']").val();
            if(newpassword != password){
                layer.msg('两次密码输入不一致');
                return false;
            }else if(password.length < 6){
                layer.msg('密码长度不能小于6位');
                return false;
            }
        }
        //验证旧密码
        function oldpassword() {
            //获取当前输入的旧密码
            var oldpassword = $(":input[name = 'oldpassword']").val();
            if(oldpassword == ""){
                layer.msg('请输入旧密码');
                return false;
            }else{
                //去数据库进行加密然后返回
                $.post("self/md5",{oldpassword:oldpassword},function (data) {
                    var password = "${sessionScope.login_user.password}";
                    if(password != data){
                        layer.msg('旧密码输入错误');
                        return false;
                    }
                })
            }
        }

        //旧密码失去焦点时判断旧密码是否输入正确
        $(":input[name = 'oldpassword']").blur(function () {
            oldpassword();
        })
        //新密码匹配确认
        $(":input[name = 'password']").blur(function () {
            newpassword();
        })


        function sub() {
            //判断密码是否符合格式
            if(oldpassword() == null && newpassword() == null){
                //获取表单参数
                var password = $(":input[name = 'password']").val();
                var sex = $(":input[name = 'sex']:checked").val();
                var phoneTel = $(":input[name = 'phoneTel']").val();
                var email = $(":input[name = 'email']").val();
                var id = $(":input[name = 'id']").val();
                //修改数据
                $.post("self/update",{password:password,sex:sex,phoneTel:phoneTel,email:email,id:id},function (data) {
                    if(data){
                        layer.alert('密码已修改,请重新登录!', {icon: 6},function () {
                            window.parent.location.href = "/elepower/logout";
                        });
                    }
                })
            }
        }

    </script>
</body>
</html>